<script setup lang="ts">
import { useLayoutStore } from '@/stores/layout'

const layoutStore = useLayoutStore()
</script>

<template>
  <div ref="self" class="fixed-action" :style="{
    left: layoutStore.sidebarNowWidth + 'px' 
  }">
    <slot></slot>
  </div>
</template>

<style scoped>
.fixed-action {
  position: fixed;
  bottom: 0;
  right: 0;
  padding: 28rem 44rem;
  border-radius: 8rem 8rem 0 0;
  background-color: #ffffff;
  box-shadow: 0px -4px 4px 0px rgba(0, 0, 0, 0.04);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 1000;
}
</style>
